<template>
  <div v-for="item in name" :key='item'>
  {{ item }}
  </div>

  <div v-for="item in data" :key="item">
    <p>{{ item.title }}</p>
    <img v-bind:src=" item.cover" alt="">
  </div>
  
</template>

<script>

export default {
  setup () {
const name=[1,2,3,4,5]

// 复杂数据
const  data=
             [
                {
                  "id":1,
                    "title": "杀戮天眼",
                    "url": "https://movie.douban.com/subject/30304769/",
                    "cover": "https://img9.doubanio.com/view/photo/s_ratio_poster/public/p2561506095.webp"
                },
                {
                  "id":2,
                    "title": "英勇废柴",
                    "url": "https://movie.douban.com/subject/34663688/",         
                    "cover": "https://img1.doubanio.com/view/photo/s_ratio_poster/public/p2563993939.webp",
              
                },
                {
                    "id":3,
                    "title": "秘密窝点",
                    "url": "https://movie.douban.com/subject/30206909/",
                    "cover": "https://img3.doubanio.com/view/photo/s_ratio_poster/public/p2617708810.webp",
                    
                },
              ]

    return {
      name,
      data
    }
  }
}
</script>

<style>

</style>